<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<title>jmpress.js | a jQuery plugin to build a website on the infinite canvas</title>

	<meta name="description" content="jmpress.js is a jQuery plugin to build a website on the infinite canvas">
	<meta name="author" content="Kyle Robinson Young @shama & Tobias Koppers @sokra" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta http-equiv="expires" content="0">

	<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/start/jquery-ui.css" rel="stylesheet" />
</head>
<body>

<div id="home" class="step">
	<h1>introducing jmpress.js</h1>
	<p>build a website on the infinite canvas by sokra & shama</p>
</div>

<div id="about" class="step">
	<h1>About</h1>
	<p>I am pure &lt;html&gt;, .css {} and function javascript() {} and use CSS3 transitions and transformations.</p>
	<p id="pan">I can pan,</p>
	<p id="rotate">rotate</p>
	<p id="scale">and scale between elements on an infinite canvas.</p>
</div>

<div id="support" class="step">
	<h1>Support</h1>
	<p>I currently work with most modern web browsers and fallback to simpler transitions with unsupported browsers.</p>
</div>

<div id="impress" class="step">
	<h1>jQuery port of impress.js</h1>
	<p>but I have become much, much more.</p>
</div>

<div id="features" class="step">
	<h1>Features</h1>
	<ul class="features">
		<li>custom animations
		<li>nested steps
		<li>printable
		<li>ajax loaded steps
		<li>presenter notes
		<li>templating
		<li>routing
		<li>keyboard controls
		<li>zoomable steps
		<li>plugins
	</ul>
</div>

<div id="presenter" class="step">
	<h1>get started quickly</h1>
	<p>by using one of our pre-made presentation templates</p>
</div>

<div id="notes" class="step">
	<h1>Presenter notes</h1>
	<p>:)</p>
</div>

<div id="printable" class="step">
	<h1>De-init jmpress</h1>
	<p>allowing your presentation to be printed.</p>
</div>

<div id="zoom" class="step">
	<h1>Zooming</h1>
	<p>Yes it also works in presentation mode.</p>
</div>

<div id="animations" class="step">
	<h1>Custom animations</h1>
	<p>using the data-jmpress attribute.</p>
</div>

<div id="developer" class="step">
	<h1>TODO: add more stupid text in presentation notes</h1>
</div>

<div style="height: 1000px"></div>

</body>
</html>
